:root {
  --side-bar-bg-color: #fafafa;
  --control-text-color: #777;

  --color-white: #ffffff;
  --color-grey-light: #e6e6e6;
  --color-grey: #808080;
  --color-black: #333333;
  --color-green-dark: #006600;
  --color-green: #00cc00;
  --color-green-light: #ccffcc;
  --color-green-lighter: #f0fff0;
  --color-green-lightest: #fcfffc;
  --color-green-shade: #bddbbd;
  --color-green-code: #59a659;

  --serif: "Optima", "方正新书宋", serif;
  --sans-serif: "Optima", "冬青黑体", sans-serif;
  --monospace: "JetBrains Mono", monospace;

  --base-font-size: 16px;
  --h1-font-size: 2.5em;
  --h2-font-size: 2em;
  --h3-font-size: 1.75em;
  --h4-font-size: 1.5em;
  --h5-font-size: 1.25em;
  --h6-font-size: 1.25em;
}

body {
  max-width: 1440px;
  margin: 0 auto;
  padding: 30px;
  padding-bottom: 100px;

  font-family: var(--sans-serif);
  font-size: var(--base-font-size);
  color: var(--color-black);
  background-color: var(--color-green-lightest);
  line-height: 1.6;
}

body * {
  box-sizing: border-box !important;
}

body *::selection {
  background-color: var(--color-green-light);
}

ul:first-child,
ol:first-child {
  margin-top: 30px;
}

a {
  color: #4183c4;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  position: relative;
  margin-top: 1rem;
  margin-bottom: 1rem;
  font-weight: bold;
  line-height: 1.4;
  cursor: text;
}
h1:hover a.anchor,
h2:hover a.anchor,
h3:hover a.anchor,
h4:hover a.anchor,
h5:hover a.anchor,
h6:hover a.anchor {
  text-decoration: none;
}
h1 tt,
h1 code {
  font-size: inherit;
}
h2 tt,
h2 code {
  font-size: inherit;
}
h3 tt,
h3 code {
  font-size: inherit;
}
h4 tt,
h4 code {
  font-size: inherit;
}
h5 tt,
h5 code {
  font-size: inherit;
}
h6 tt,
h6 code {
  font-size: inherit;
}
h1 {
  margin-bottom: var(--h1-font-size);
  text-align: center;
  font-family: var(--serif);
  font-weight: normal;
  font-size: var(--h1-font-size);
  line-height: 1.2;
}
h1:has(+ h1, + h2) {
  margin-bottom: 1em;
}
h2 {
  margin-bottom: var(--h1-font-size);
  text-align: center;
  font-family: var(--serif);
  font-weight: normal;
  font-size: var(--h2-font-size);
  line-height: 1.225;
}

h3 {
  padding: 6px 8px 0px 8px;
  font-family: var(--serif);
  font-weight: normal;
  font-size: var(--h3-font-size);
  line-height: 1.43;
  border-left: 5px solid var(--color-green-dark);
  border-bottom: 2px solid var(--color-green-shade);
}
h4 {
  font-family: var(--serif);
  font-weight: normal;
  font-size: var(--h4-font-size);
}
h5 {
  font-family: var(--serif);
  font-weight: normal;
  font-size: var(--h5-font-size);
}
h6 {
  font-family: var(--serif);
  font-weight: normal;
  color: var(--color-grey);
  font-size: var(--h6-font-size);
}
code {
  font-family: var(--monospace);
  font-weight: normal;
  color: var(--color-green-code);
  font-size: var(--base-font-size);
}
p,
blockquote,
ul,
ol,
dl,
table {
  margin: 0.8em 0;
}
li > ol,
li > ul {
  margin: 0 0;
}
hr {
  height: 2px;
  padding: 0;
  margin: 16px 0;
  background-color: var(--color-green-shade);
  border: 0 none;
  overflow: hidden;
  box-sizing: content-box;
}
hr:has(+ hr) {
  display: none;
}
hr + hr {
  height: 0px;
  background-color: inherit;
  page-break-after: always !important;
}
li::marker {
  font-weight: bold;
  color: var(--color-green-code);
}
li p.first {
  display: inline-block;
}
ul,
ol {
  padding-left: 1em;
}
ul:first-child,
ol:first-child {
  margin-top: 0;
}
ul:last-child,
ol:last-child {
  margin-bottom: 0;
}
blockquote {
  padding: 4px 0.5em;
  font-style: italic;
  border-top: 2px solid var(--color-black);
  border-bottom: 2px solid var(--color-black);
}
table {
  padding: 0;
  word-break: initial;
  overflow: hidden;
}
table tr {
  border: 1px solid var(--color-grey-light);
  margin: 0;
  padding: 0;
}
table th {
  text-align: center;
  font-weight: normal;
  border: 1px solid var(--color-grey-light);
  border-bottom: 0;
  margin: 0;
  padding: 6px 0.5em 2px 0.5em;
  color: var(--color-white);
  background-color: var(--color-green-dark);
}
table td {
  border: 1px solid var(--color-grey-light);
  margin: 0;
  padding: 6px 0.5em 2px 0.5em;
}
table th:first-child,
table td:first-child {
  margin-top: 0;
}
table th:last-child,
table td:last-child {
  margin-bottom: 0;
}

.MathJax {
  padding: 0 0.25em 0 0.25em;
}

.CodeMirror-lines {
  padding-left: 4px;
}

.code-tooltip {
  box-shadow: 0 1px 1px 0 rgba(0, 28, 36, 0.3);
  border-top: 1px solid #eef2f2;
}

.md-fences,
code,
tt {
  border: 1px solid #e7eaed;
  background-color: #f8f8f8;
  border-radius: 3px;
  padding: 0;
  padding: 2px 4px 0px 4px;
  font-size: 0.9em;
}

code {
  color: var(--color-green-code);
  background-color: inherit;
  border: none;
  padding: 0 0.25em 0 0.25em;
}
